<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>管理员登录 - 物流订单跟踪系统</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="/css/theme.css">
    <style>
        body {
            display: flex;
            align-items: center;
            justify-content: center;
            min-height: 100vh;
            background-color: var(--bg-color);
        }
        .login-container {
            width: 100%;
            max-width: 400px;
            padding: 30px;
            background-color: var(--card-bg);
            border-radius: var(--border-radius-lg);
            box-shadow: var(--box-shadow);
            animation: fadeIn var(--transition-speed);
        }
    </style>
</head>
<body>
<div class="login-container">
    <h2 class="text-center mb-4">管理员登录</h2>
    <form id="loginForm" method="POST">
        <div class="mb-3">
            <label for="username" class="form-label">管理员账号:</label>
            <input type="text" class="form-control" id="username" name="username" required>
        </div>
        <div class="mb-3">
            <label for="password" class="form-label">密码:</label>
            <input type="password" class="form-control" id="password" name="password" required>
        </div>
        <button type="submit" class="btn btn-primary w-100">登录</button>
    </form>
    <div id="loginError" class="mt-3 text-danger text-center">
        <!-- 登录错误信息将显示在这里 -->
    </div>
    <div class="mt-3 text-center">
        <p><a href="/">返回首页</a></p>
    </div>
</div>

<script>
    document.addEventListener('DOMContentLoaded', function() {
        const urlParams = new URLSearchParams(window.location.search);
        const loginErrorDiv = document.getElementById('loginError');

        if (urlParams.has('error')) {
            loginErrorDiv.textContent = '用户名或密码错误，请重试。';
        }

        // 添加表单提交事件
        document.getElementById('loginForm').addEventListener('submit', function(e) {
            e.preventDefault();
            const username = document.getElementById('username').value;
            const password = document.getElementById('password').value;
            const loginErrorDiv = document.getElementById('loginError');
            
            console.log('尝试管理员登录:', username);
            loginErrorDiv.textContent = '登录中...';
            
            // 发送登录请求
            fetch('/api/v1/auth/admin-login', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify({ username, password }),
                credentials: 'same-origin'
            })
            .then(response => {
                console.log('登录响应状态:', response.status);
                if (response.ok) {
                    loginErrorDiv.textContent = '登录成功，正在跳转...';
                    // 添加一个时间戳参数，避免缓存问题
                    // 添加短暂延迟，确保会话已经建立
                    setTimeout(() => {
                        window.location.href = '/admin/dashboard.html#' + new Date().getTime();
                    }, 500);
                    return null; // 不需要解析响应体
                } else {
                    return response.text().then(text => {
                        throw new Error(text || '登录失败，状态码: ' + response.status);
                    });
                }
            })
            .catch(error => {
                console.error('登录错误:', error);
                loginErrorDiv.textContent = error.message;
            });
        });
    });
</script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>